<template>
	<view class="wode">
		<view class="box">
			<view class="user-box">
				<view class="user">
					<image :src="userData?userData.avatar :'../../static/headIcon.jpg'"></image>
					<text>{{userData?userData.nickname : ''}}</text>
				</view>
				<view class="user-right" v-if="userData&&userData.vipType==1">
					<view class="user-right-view1">plus会员</view>
					<image src="../../static/plushy.png" mode=""></image>
				</view>
				<view class="user-right" v-if="userData&&userData.vipType==2">
					<view class="user-right-view2">代理商</view>
					<image src="../../static/dls.png" mode=""></image>
				</view>
				<view class="user-right" v-if="userData&&userData.vipType==3">
					<view class="user-right-view3">合伙人</view>
					<image src="../../static/hhr.png" mode=""></image>
				</view>
				<view class="user-right" v-if="userData&&userData.vipType==4">
					<view class="user-right-view">联合创始人</view>
					<image src="../../static/wd_dj.png" mode=""></image>
				</view>
			</view>
			<view class="box-fx">
				<view class="box-fx-left">
					<view class="box-fx-left-view">我的邀请码：{{userData?userData.recodeCode:''}}</view>
					<view class="box-fx-left-view1" @click="copy">复制</view>
				</view>
				<view class="box-fx-right" @click="handlefenxiang">
					<text>分享</text>
					<image src="../../static/wd_fx.png" mode=""></image>
				</view>
			</view>
			<view class="box-quanbu" @click="handlewodedingdan">
				<view class="box-quanbu-left">
					我的订单
				</view>
				<view class="box-quanbu-right">
					<text>查看全部</text>
					<image src="../../static/xiayibu@2x.png" mode=""></image>
				</view>
			</view>
			<view class="box-container">
				<view class="box-container-item" @click="handledingdanliebiao(1)">
					<image src="../../static/wd_dzf@2x.png" mode=""></image>
					<text>待支付</text>
					<view class="box-container-item-num" v-if="data && data.noPayCount > 0">{{data.noPayCount}}</view>
				</view>
				<view class="box-container-item" @click="handledingdanliebiao(2)">
					<image src="../../static/wd_dfh@2x.png" mode=""></image>
					<text>待发货</text>
					<view class="box-container-item-num" v-if="data && data.noDeliveryCount > 0">{{data.noDeliveryCount}}</view>
				</view>
				<view class="box-container-item" @click="handledingdanliebiao(3)">
					<image src="../../static/wd_dsh@2x.png" mode=""></image>
					<text>待收货</text>
					<view class="box-container-item-num" v-if="data && data.takeCount > 0">{{data.takeCount}}</view>
				</view>
				<view class="box-container-item" @click="handlewodepingjia">
					<image src="../../static/wd_pj@2x.png" mode=""></image>
					<text>评价</text>
				</view>
				<view class="box-container-item" @click="handledingdanliebiao(-1)">
					<image src="../../static/wd_sh@2x.png" mode=""></image>
					<text>售后</text>
					<view class="box-container-item-num" v-if="data && data.afterSaleCount > 0">{{data.afterSaleCount}}</view>
				</view>
			</view>
		</view>
		<view class="box1">
			<view class="box1-item" @click="handleyouhuiquan">
				<image class="box1-item-image" src="http://hmh-app.oss-cn-beijing.aliyuncs.com/webStorage/web_16919957210235417.png" mode=""></image>
				<text class="box1-item-text">优惠券</text>
			</view>
			<view class="box1-item" @click="handleshoucang">
				<image class="box1-item-image" src="http://hmh-app.oss-cn-beijing.aliyuncs.com/webStorage/web_16919957346801123.png" mode=""></image>
				<text class="box1-item-text">我的收藏</text>
			</view>
			<view class="box1-item" @click="handlezuji">
				<image class="box1-item-image" src="http://hmh-app.oss-cn-beijing.aliyuncs.com/webStorage/web_16919957508324023.png" mode=""></image>
				<text class="box1-item-text">我的足迹</text>
			</view>
			<view class="box1-item" @click="handleshouhuodizhi">
				<image class="box1-item-image" src="http://hmh-app.oss-cn-beijing.aliyuncs.com/webStorage/web_16919957683746035.png" mode=""></image>
				<text class="box1-item-text">收货地址</text>
			</view>
			<button open-type='contact' class="box1-item2">
				<image class="box1-item-image" src="http://hmh-app.oss-cn-beijing.aliyuncs.com/webStorage/web_16919958739748788.png" mode=""></image>
				<text class="box1-item-text">在线客服</text>
			</button>
			<view class="box1-item" @click="handleyonghufankui">
				<image class="box1-item-image" src="http://hmh-app.oss-cn-beijing.aliyuncs.com/webStorage/web_16919957848032939.png" mode=""></image>
				<text class="box1-item-text">用户反馈</text>
			</view>
			
			<view class="box1-item1" @click="handlewodeyongjin">
				<image class="box1-item-image" src="http://hmh-app.oss-cn-beijing.aliyuncs.com/webStorage/web_1691995801081125.png" mode=""></image>
				<text class="box1-item-text">我的嗨币</text>
			</view>
			<view class="box1-item3" @click="handlewodejifen">
				<image class="box1-item-image" src="http://hmh-app.oss-cn-beijing.aliyuncs.com/webStorage/web_16919958216801257.png" mode=""></image>
				<text class="box1-item-text">我的积分</text>
			</view>
			<view class="box1-item1" @click="handlewodetuandui">
				<image class="box1-item-image" src="http://hmh-app.oss-cn-beijing.aliyuncs.com/webStorage/web_16919958342998315.png" mode=""></image>
				<text class="box1-item-text">我的团队</text>
			</view>
		</view>
		<button open-type="contact" class="box-xuanfu">
			<image src="../../static/kf_wx@2x.png" mode="" ></image>
		</button>
		<u-tabbar :list="tabbar" :mid-button="false" icon-size='45' active-color="#3E3E3E" inactive-color="#3E3E3E" :before-switch="beforeSwitch"></u-tabbar>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				userInfo:'',
				tabbar:[{
						iconPath: "/static/tab_sy_1.png",
						selectedIconPath: "/static/tab_sy_2.png",
						text: '首页',
						pagePath: "/pages/index/index"
					},{
						iconPath: "/static/tab_fl_1.png",
						selectedIconPath: "/static/tab_fl_2.png",
						text: '嗨美商城',
						pagePath: "/pages/fenlei/fenlei"
					},
					{
						iconPath: "/static/tab_gwd_1.png",
						selectedIconPath: "/static/tab_gwd_2.png",
						text: '购物车',
						count: 0,
						isDot: false,
						customIcon: false,
						pagePath: "/pages/gouwudai/gouwudai"
					},
					{
						iconPath: "/static/tab_wd_1.png",
						selectedIconPath: "/static/tab_wd_2.png",
						text: '会员中心',
						pagePath: "/pages/wode/wode"
					},
				],
				isflag:true,
				data:'',
				userData:'',
				configData:'',
				share:uni.getStorageSync('share')
			}
		},
		onLoad() {
			//this.getUserInfo()
			this.userInfo = this.vuex_user
			console.log(this.userInfo)
			
		},
		onShow() {
			this.getCartCount()
			this.getUserOrderCount()
			this.getUserInfo()
			this.getUrlConfig()
		},
		methods: {
			//订单数量
			async getUserOrderCount(){
				const res = await this.$u.api.getUserOrderCount()
				this.data = res.data
				
			},
			//购物袋数量
			async getCartCount(){
				const res = await this.$u.api.getCartCount()
				console.log(res,'购物车数量')
				this.tabbar[2].count = res.data
			},
			//用户信息
			async getUserInfo(){
				const res = await this.$u.api.getUserInfo()
				this.userData = res.data
				
			},
			//登录
			handlelogin(){
				if (this.userInfo && this.userInfo.nickname) {
					
				}else{
					uni.navigateTo({
						url:'/pages/login/login'
					})
				}
				
			},
			//复制
			copy(){
				uni.setClipboardData({
					data: this.userData.recodeCode,
					success: () => {
						uni.showToast({
							title: '复制成功',
							icon:"none"
						})
					}
				})
			},
			//订单详情
			handledingdanliebiao(data){
				const params = 'status=' + data
				uni.navigateTo({
					url:'/pages/wodedingdan/wodedingdan?' + params
				})
			},
			//收货地址
			async handleshouhuodizhi(){
				const params = 'type=' + 1
				uni.navigateTo({
					url:'/pages/shouhuodizhi/shouhuodizhi?' + params
				})
				
			},
			//我的评价
			handlewodepingjia(){
				uni.navigateTo({
					url:'/pages/wodepingjia/wodepingjia'
				})
			},
			//售后
			handleshouhou(){
				uni.navigateTo({
					url:'/pages/shouhoujilu/shouhoujilu'
				})
			},
			//我的收藏
			handleshoucang(){
				uni.navigateTo({
					url:'/pages/wodeshoucang/wodeshoucang'
				})
			},
			//我的足迹
			handlezuji(){
				// uni.requestSubscribeMessage({
				// 	tmplIds: ['Gp_Fz-MpgtVaonOao2SXv0iOSMqRl0f6JTABDx8hHuY'],
				// 	complete: (res) => {
				// 		console.log(res,'999');
					
				// 	}
				// })
				uni.navigateTo({
					url:'/pages/wodezuji/wodezuji'
				})
			},
			//用户反馈
			handleyonghufankui(){
				uni.navigateTo({
					url:'/pages/yonghufankui/yonghufankui'
				})
			},
			//优惠券
			handleyouhuiquan(){
				uni.navigateTo({
					url:'/pages/youhuiquan/youhuiquan'
				})
			},
			//我的订单
			handlewodedingdan(){
				uni.navigateTo({
					url:'/pages/wodedingdan/wodedingdan'
				})
			},
			async getUrlConfig(){
				const res = await this.$u.api.getUrlConfig()
				this.configData = res.data
			},
			//我的嗨币
			handlewodeyongjin(){
				console.log(this.configData,this.vuex_token,1111)
				if (this.configData.isHide) {
					const params = 'webViewUrl=' + this.configData.webViewUrl 
					uni.navigateTo({
						url:'/pages/webview/webview?' + params
					})
				}else{
					uni.navigateTo({
						url:'/pages/wodeyongjin/wodeyongjin'
					})
				}
				// uni.navigateTo({
				// 	url:'/pages/wodeyongjin/wodeyongjin'
				// })
			},
			//分享
			handlefenxiang(){
				uni.navigateTo({
					url:'/pages/fenxiang/fenxiang'
				})
			},
			//我的积分
			handlewodejifen(){
				uni.navigateTo({
					url:'/pages/wodejifen/wodejifen'
				})
			},
			//我的团队
			handlewodetuandui(){
				uni.navigateTo({
					url:'/pages/wodetuandui/wodetuandui'
				})
			},
			//切换之前回调
			async beforeSwitch(index){
				if (index == 2 || index == 3) {
					const res = await this.$u.api.getUserInfo()
					return true
				}
			}
		}
	}
</script>
<style>
	page{
		background: #FBFBFB;
	}
	.u-badge--bg--error.data-v-2b1712d8{
		background: #5D22BA !important;
	}
</style>
<style scoped lang="scss">
    .slot-wrap {
    	display: flex;
    	align-items: center;
    	justify-content: center;
    	/* 如果您想让slot内容占满整个导航栏的宽度 */
    	// flex: 1;
    	/* 如果您想让slot内容与导航栏左右有空隙 */
    	padding-left: 316rpx;
    }
    .slot-wrap image{
    	width: 116rpx;
    	height: 36rpx;
    }
	.box{
		background: white;
	}
	.user-box{
		padding: 44rpx 0rpx;
		margin: 0rpx 28rpx;
		border-bottom: 0.5px solid #E3E3E3;
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
	}
	.user{
		display: flex;
		flex-direction: row;
		align-items: center;
	}
	.user image{
		width: 116rpx;
		height: 116rpx;
		border-radius: 50%;
	}
	.user text{
		margin-left: 32rpx;
		font-size: 32rpx;
		font-family: PingFang SC-Medium, PingFang SC;
		font-weight: 500;
		color: #000000;
		line-height: 38rpx;
	}
	.user-right{
		display: flex;
		flex-direction: row;
		align-items: center;
	}
	.user-right-view1{
		padding: 10rpx 50rpx;
		font-size: 28rpx;
		font-family: Source Han Sans CN;
		font-weight: 500;
		color: #BD5A1C;
		line-height: 32rpx;
		text-shadow: 0px -1px 1px rgba(94,94,94,0.35);
		border-radius: 38rpx 0rpx 0rpx 38rpx;
		border-bottom: 1rpx solid #BD5A1C;
		border-top: 1rpx solid #BD5A1C;
		border-left: 1rpx solid #BD5A1C;
		margin-right: -20rpx;
	}
	.user-right-view2{
		padding: 10rpx 50rpx;
		font-size: 28rpx;
		font-family: Source Han Sans CN;
		font-weight: 500;
		color: #2763D5;
		line-height: 32rpx;
		text-shadow: 0px -1px 1px rgba(94,94,94,0.35);
		border-radius: 38rpx 0rpx 0rpx 38rpx;
		border-bottom: 1rpx solid #2763D5;
		border-top: 1rpx solid #2763D5;
		border-left: 1rpx solid #2763D5;
		margin-right: -20rpx;
	}
	.user-right-view3{
		padding: 10rpx 50rpx;
		font-size: 28rpx;
		font-family: Source Han Sans CN;
		font-weight: 500;
		color: #A95FE4;
		line-height: 32rpx;
		text-shadow: 0px -1px 1px rgba(94,94,94,0.35);
		border-radius: 38rpx 0rpx 0rpx 38rpx;
		border-bottom: 1rpx solid #A95FE4;
		border-top: 1rpx solid #A95FE4;
		border-left: 1rpx solid #A95FE4;
		margin-right: -20rpx;
	}
	.user-right-view{
		padding: 10rpx 50rpx;
		font-size: 28rpx;
		font-family: Source Han Sans CN;
		font-weight: 500;
		color: #9422CB;
		line-height: 32rpx;
		text-shadow: 0px -1px 1px rgba(94,94,94,0.35);
		border-radius: 38rpx 0rpx 0rpx 38rpx;
		border-bottom: 1rpx solid #9422CB;
		border-top: 1rpx solid #9422CB;
		border-left: 1rpx solid #9422CB;
		margin-right: -20rpx;
	}
	.user-right image{
		width: 94rpx;
		height: 94rpx;
	}
	.box-fx{
		margin: 0rpx 28rpx;
		padding: 48rpx 0rpx;
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
		border-bottom: 0.5px solid #E3E3E3;
	}
	.box-fx-left{
		display: flex;
		flex-direction: row;
		align-items: center;
	}
	.box-fx-left-view{
		font-size: 38rpx;
		font-family: Source Han Sans CN;
		font-weight: 400;
		color: #232323;
		line-height: 48rpx;
	}
	.box-fx-left-view1{
		padding: 4rpx 8rpx;
		font-size: 20rpx;
		font-family: Source Han Sans CN;
		font-weight: 500;
		color: #979797;
		line-height: 20rpx;
		border: 1rpx solid #979797;
		border-radius: 38rpx 38rpx 38rpx 38rpx;
		margin-left: 20rpx;
	}
	.box-fx-right{
		display: flex;
		flex-direction: row;
		align-items: center;
		padding: 10rpx 22rpx;
		border: 1rpx solid #E3E3E3;
		border-radius: 38rpx 38rpx 38rpx 38rpx;
	}
	.box-fx-right text{
		padding-right: 10rpx;
		font-size: 34rpx;
		font-family: Source Han Sans CN;
		font-weight: 500;
		color: #1F1E19;
		line-height: 34rpx;
	}
	.box-fx-right image{
		width: 30rpx;
		height: 34rpx;
	}
	.box-quanbu{
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
		padding: 48rpx 16rpx 0rpx 28rpx;
	}
	.box-quanbu-left{
		font-size: 32rpx;
		font-family: PingFang SC-Bold, PingFang SC;
		font-weight: bold;
		color: #333333;
		line-height: 38rpx;
	}
	.box-quanbu-right{
		display: flex;
		flex-direction: row;
		align-items: center;
	}
	.box-quanbu-right text{
		font-size: 28rpx;
		font-family: PingFang SC-Regular, PingFang SC;
		font-weight: 400;
		color: #666666;
		line-height: 32rpx;
	}
	.box-quanbu-right image{
		margin-left: 12rpx;
		width: 36rpx;
		height: 36rpx;
	}
	.box-container{
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		padding: 48rpx 40rpx;
	}
	.box-container-item{
		display: flex;
		flex-direction: column;
		align-items: center;
		position: relative;
	}
	.box-container-item-num{
		position: absolute;
		right: -14rpx;
		top: -14rpx;
		background: url('http://hmh-app.oss-cn-beijing.aliyuncs.com/webStorage/web_16919793742137642.png') no-repeat;
		background-size: 100% 100%;
		width: 34rpx;
		height: 34rpx;
		border-radius: 50%;
		font-size: 18rpx;
		font-family: PingFang SC-Regular, PingFang SC;
		font-weight: 400;
		color: #ffffff;
		line-height: 34rpx;
		text-align: center;
	}
	.box-container-item text{
		margin-top: 32rpx;
		font-size: 28rpx;
		font-family: PingFang SC-Medium, PingFang SC;
		font-weight: 500;
		color: #333333;
		line-height: 32rpx;
	}
	.box-container-item image{
		width: 56rpx;
		height: 56rpx;
	}
	.box1{
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
		margin-top: 28rpx;
		background: white;
		margin-bottom: 150rpx;
	}
	.box1-item{
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		width: 250rpx;
		height: 250rpx;
        border-right: 0.5px solid #E3E3E3;
		border-bottom: 0.5px solid #E3E3E3;
	}
	.box1-item1{
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		width: 250rpx;
		height: 250rpx;
		border-right: 0.5px solid #E3E3E3;
	}
	.box1-item2{
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		width: 250rpx;
		height: 250rpx;
		border-right: 0.5px solid #E3E3E3;
		padding: 0;
		background: none;
		margin: 0;
	}
	.box1-item3{
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		width: 250rpx;
		height: 250rpx;
		border-right: 0.5px solid #E3E3E3;
		border-top: 0.5px solid #E3E3E3;
	}
	.box1-item2::after{
		border: none;
	}
	.box1-item-image{
		width: 56rpx;
		height: 56rpx;
	}
	.box1-item-text{
		margin-top: 28rpx;
		font-size: 28rpx;
		font-family: PingFang SC-Regular, PingFang SC;
		font-weight: 400;
		color: #000000;
		line-height: 32rpx;
	}
	
	.box-xuanfu{
		display: flex;
		flex-direction: column;
		position: fixed;
		right: 15rpx;
		bottom: 300rpx;
		background: none;
		margin: 0;
	}
	.box-xuanfu::after{
		border: none;
	}
	.box-xuanfu image{
		width: 88rpx;
		height: 88rpx;
	}
</style>
